﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <title></title>
    <link href="../src/css/rayui.css" rel="stylesheet" />
    <link href="../css/common.css" rel="stylesheet" />
    <script src="../plugins/jquery-1.12.4.js"></script>
    <script src="../scripts/footer.js"></script>
    <script src="../src/js/rayui.js" use="elem"></script>
    <script src="../scripts/common.js"></script>
    <style>
        body {
            padding: 20px;
            margin: 0 auto;
        }
    </style>
</head>
<body>
    <p>
        elem.js是jquery扩展，方法包括：容器高度最大化、全屏
    </p>
    
    <h3>1、全屏</h3>
    <div class="card">
        <pre class="word-wrap">
使用方法：
$("selector").fullHeight(heightOpt);
1、heightOpt有三种格式：
    full-数值: 窗口最大值 - 设定数值
    top-数值: 窗口最大值 - 容器offset.top - 设定数值
    sel-jq选择器-数值：窗口最大值 - jq选择器所有的高度 - 设定数值，jq选择器只能以#和.开始，即只能是class或则id，不支持混用

</pre>
    </div>


    <h3>2、窗口最大化</h3>
    <a class="rayui-btn btn-success" id="fullScreen">全屏</a>
    <div class="card">
        <pre class="word-wrap">
使用方法：
$.fullScreen();
这个没啥好说的，直接用就行啦
</pre>
    </div>


    <script>
        rayui.ready(function () {
           
            //全屏
            $("#fullScreen").click(function () {
                $.fullScreen();
            });
        });

    </script>


</body>
</html>